<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title></title>
		<link rel="stylesheet" href="dashboard/dashboard.css" />
		<link rel="stylesheet" href="css/bootstrap.min.css" />
	</head>
	<body>
		
	<script src="js/jquery-1.11.3.min.js"></script>
	<script type="text/javascript" src='dashboard/dashboard.js'></script>
	<script type="text/javascript" src='layer/layer.js'></script>
<div class="container">	
	<div id="dashboard" class="dashboard dashboard-draggable" data-height="443">
        <div class="row">
            <div class="col-sm-8" data-id="96764297878704278" data-color="dashboard-color-blue" data-order="1">
            	<div class="panel dashboard-color-blue" id="widget-1" data-url="" data-id="1">
	                <div class="panel-heading">
                        <div class="panel-actions">
                        	<a data-toggle="dropdown" class="action" href="javascript:void(0);" aria-expanded="false">
                        		<i class="home_color_box">选颜色</i>
                        	</a>
                        	<ul class="dropdown-menu color-select pull-right" style='top:38px;'>
                                <li>
                                	<span class="bg-color-green" data-widget-setstyle="dashboard-color-green" data-toggle="tooltip" data-placement="left" data-original-title="Green Grass"></span>
                                </li>
                                <li><span class="bg-color-greenDark" data-widget-setstyle="dashboard-color-greenDark" data-toggle="tooltip" data-placement="top" data-original-title="Dark Green"></span></li>
                                <li><span class="bg-color-greenLight" data-widget-setstyle="dashboard-color-greenLight" data-toggle="tooltip" data-placement="top" data-original-title="Light Green"></span></li>
                                <li><span class="bg-color-purple" data-widget-setstyle="dashboard-color-purple" data-toggle="tooltip" data-placement="top" data-original-title="Purple"></span></li>
                                <li><span class="bg-color-magenta" data-widget-setstyle="dashboard-color-magenta" data-toggle="tooltip" data-placement="top" data-original-title="Magenta"></span></li>
                                <li><span class="bg-color-pink" data-widget-setstyle="dashboard-color-pink" data-toggle="tooltip" data-placement="right" data-original-title="Pink"></span></li>
                                <li><span class="bg-color-pinkDark" data-widget-setstyle="dashboard-color-pinkDark" data-toggle="tooltip" data-placement="left" data-original-title="Fade Pink"></span></li>
                                <li><span class="bg-color-blueLight" data-widget-setstyle="dashboard-color-blueLight" data-toggle="tooltip" data-placement="top" data-original-title="Light Blue"></span></li>
                                <li><span class="bg-color-teal" data-widget-setstyle="dashboard-color-teal" data-toggle="tooltip" data-placement="top" data-original-title="Teal"></span></li>
                                <li><span class="bg-color-blue" data-widget-setstyle="dashboard-color-blue" data-toggle="tooltip" data-placement="top" data-original-title="Ocean Blue"></span></li>
                                <li><span class="bg-color-blueDark" data-widget-setstyle="dashboard-color-blueDark" data-toggle="tooltip" data-placement="top" data-original-title="Night Sky"></span></li>
                                <li><span class="bg-color-darken" data-widget-setstyle="dashboard-color-darken" data-toggle="tooltip" data-placement="right" data-original-title="Night"></span></li>
                                <li><span class="bg-color-yellow" data-widget-setstyle="dashboard-color-yellow" data-toggle="tooltip" data-placement="left" data-original-title="Day Light"></span></li>
                                <li><span class="bg-color-orange" data-widget-setstyle="dashboard-color-orange" data-toggle="tooltip" data-placement="bottom" data-original-title="Orange"></span></li>
                                <li><span class="bg-color-orangeDark" data-widget-setstyle="dashboard-color-orangeDark" data-toggle="tooltip" data-placement="bottom" data-original-title="Dark Orange"></span></li>
                                <li><span class="bg-color-red" data-widget-setstyle="dashboard-color-red" data-toggle="tooltip" data-placement="bottom" data-original-title="Red Rose"></span></li>
                                <li><span class="bg-color-redLight" data-widget-setstyle="dashboard-color-redLight" data-toggle="tooltip" data-placement="bottom" data-original-title="Light Red"></span></li>
                               <!--  <li><span class="bg-color-white" data-widget-setstyle="dashboard-color-white" data-toggle="tooltip" data-placement="right" data-original-title="Purity"></span></li> -->
                            </ul>
                            <a class="action fullscreen-panel" type="button">
                                <i class="home_fullscreen">放大</i>
                            </a>
                            <a class="action collapse-panel" type="button">
                                <i class="home_collapse">折叠</i>
                            </a>
                            <a class="action remove-panel" type="button">
                                <i class="home_remove">关闭</i>
                            </a>
                        </div>
                        <i class="home_calendar"></i><span class="panel-title">我的任务</span>
                    </div>
                    <div class="panel-body">
                    		11111111111111111111111111111</br>
                    		11111111111111111111111111111</br>
                    		11111111111111111111111111111</br>
                    		11111111111111111111111111111</br>
                    		11111111111111111111111111111</br>
                    		11111111111111111111111111111</br>
                    		11111111111111111111111111111</br>
                    		11111111111111111111111111111</br>
                    		11111111111111111111111111111</br>
                    		11111111111111111111111111111</br>
                    		11111111111111111111111111111</br>
                    </div>
				</div>
			</div>
            <div class="col-sm-4" data-id="96571269029333087" data-color="dashboard-color-blue" data-order="2">
                <div class="panel dashboard-color-blue" id="widget-1" data-url="" data-id="1">
	                <div class="panel-heading">
                        <div class="panel-actions">
                            <a class="action fullscreen-panel" type="button">
                                <i class="home_fullscreen">放大</i>
                            </a>
                            <a class="action collapse-panel" type="button">
                                <i class="home_collapse">折叠</i>
                            </a>
                            <a class="action remove-panel" type="button">
                                <i class="home_remove">关闭</i>
                            </a>
                        </div>
                        <i class="home_calendar"></i><span class="panel-title">我的任务</span>
                    </div>
                    <div class="panel-body">
                    		11111111111111111111111111111</br>
                    		11111111111111111111111111111</br>
                    		11111111111111111111111111111</br>
                    		11111111111111111111111111111</br>
                    		11111111111111111111111111111</br>
                    		11111111111111111111111111111</br>
                    		11111111111111111111111111111</br>
                    		11111111111111111111111111111</br>
                    		11111111111111111111111111111</br>
                    		11111111111111111111111111111</br>
                    		11111111111111111111111111111</br>
                    </div>
				</div>
            </div>
            
            <div class="col-sm-4" data-id="96764297878704279" data-color="dashboard-color-blue" data-order="3">
                <div class="panel dashboard-color-blue" id="widget-1" data-url="" data-id="1">
	                <div class="panel-heading">
                        <div class="panel-actions">
                            <a class="action fullscreen-panel" type="button">
                                <i class="home_fullscreen">放大</i>
                            </a>
                            <a class="action collapse-panel" type="button">
                                <i class="home_collapse">折叠</i>
                            </a>
                            <a class="action remove-panel" type="button">
                                <i class="home_remove">关闭</i>
                            </a>
                        </div>
                        <i class="home_calendar"></i><span class="panel-title">我的任务</span>
                    </div>
                    <div class="panel-body">
                    		11111111111111111111111111111</br>
                    		11111111111111111111111111111</br>
                    		11111111111111111111111111111</br>
                    		11111111111111111111111111111</br>
                    		11111111111111111111111111111</br>
                    		11111111111111111111111111111</br>
                    		11111111111111111111111111111</br>
                    		11111111111111111111111111111</br>
                    		11111111111111111111111111111</br>
                    		11111111111111111111111111111</br>
                    		11111111111111111111111111111</br>
                    </div>
				</div>
            </div>
            
            <div class="col-sm-4" data-id="96764297878704280" data-color="dashboard-color-blue" data-order="4">
                <div class="panel dashboard-color-blue" id="widget-1" data-url="" data-id="1">
	                <div class="panel-heading">
                        <div class="panel-actions">
                            <a class="action fullscreen-panel" type="button">
                                <i class="home_fullscreen">放大</i>
                            </a>
                            <a class="action collapse-panel" type="button">
                                <i class="home_collapse">折叠</i>
                            </a>
                            <a class="action remove-panel" type="button">
                                <i class="home_remove">关闭</i>
                            </a>
                        </div>
                        <i class="home_calendar"></i><span class="panel-title">我的任务</span>
                    </div>
                    <div class="panel-body">
                    		11111111111111111111111111111</br>
                    		11111111111111111111111111111</br>
                    		11111111111111111111111111111</br>
                    		11111111111111111111111111111</br>
                    		11111111111111111111111111111</br>
                    		11111111111111111111111111111</br>
                    		11111111111111111111111111111</br>
                    		11111111111111111111111111111</br>
                    		11111111111111111111111111111</br>
                    		11111111111111111111111111111</br>
                    		11111111111111111111111111111</br>
                    </div>
				</div>
            </div>
            
            <div class="col-sm-4" data-id="96764297878704281" data-color="dashboard-color-blue" data-order="5">
                <div class="panel dashboard-color-blue" id="widget-1" data-url="" data-id="1">
	                <div class="panel-heading">
                        <div class="panel-actions">
                            <a class="action fullscreen-panel" type="button">
                                <i class="home_fullscreen">放大</i>
                            </a>
                            <a class="action collapse-panel" type="button">
                                <i class="home_collapse">折叠</i>
                            </a>
                            <a class="action remove-panel" type="button">
                                <i class="home_remove">关闭</i>
                            </a>
                        </div>
                        <i class="home_calendar"></i><span class="panel-title">我的任务</span>
                    </div>
                    <div class="panel-body">
                    		11111111111111111111111111111</br>
                    		11111111111111111111111111111</br>
                    		11111111111111111111111111111</br>
                    		11111111111111111111111111111</br>
                    		11111111111111111111111111111</br>
                    		11111111111111111111111111111</br>
                    		11111111111111111111111111111</br>
                    		11111111111111111111111111111</br>
                    		11111111111111111111111111111</br>
                    		11111111111111111111111111111</br>
                    		11111111111111111111111111111</br>
                    </div>
				</div>
            </div>
            
            <div class="col-sm-4" data-id="96764297878704282" data-color="dashboard-color-blue" data-order="6">
            	<div class="panel dashboard-color-blue" id="widget-1" data-url="" data-id="1">
	                <div class="panel-heading">
                        <div class="panel-actions">
                            <a class="action fullscreen-panel" type="button">
                                <i class="home_fullscreen">放大</i>
                            </a>
                            <a class="action collapse-panel" type="button">
                                <i class="home_collapse">折叠</i>
                            </a>
                            <a class="action remove-panel" type="button">
                                <i class="home_remove">关闭</i>
                            </a>
                        </div>
                        <i class="home_calendar"></i><span class="panel-title">我的任务</span>
                    </div>
                    <div class="panel-body">
                    		11111111111111111111111111111</br>
                    		11111111111111111111111111111</br>
                    		11111111111111111111111111111</br>
                    		11111111111111111111111111111</br>
                    		11111111111111111111111111111</br>
                    		11111111111111111111111111111</br>
                    		11111111111111111111111111111</br>
                    		11111111111111111111111111111</br>
                    		11111111111111111111111111111</br>
                    		11111111111111111111111111111</br>
                    		11111111111111111111111111111</br>
                    </div>
				</div>
            </div>
            
            <div class="col-sm-4" data-id="96764297878704283" data-color="dashboard-color-blue" data-order="7">
            	<div class="panel dashboard-color-blue" id="widget-1" data-url="" data-id="1">
	                <div class="panel-heading">
                        <div class="panel-actions">
                            <a class="action fullscreen-panel" type="button">
                                <i class="home_fullscreen">放大</i>
                            </a>
                            <a class="action collapse-panel" type="button">
                                <i class="home_collapse">折叠</i>
                            </a>
                            <a class="action remove-panel" type="button">
                                <i class="home_remove">关闭</i>
                            </a>
                        </div>
                        <i class="home_calendar"></i><span class="panel-title">我的任务</span>
                    </div>
                    <div class="panel-body">
                    		11111111111111111111111111111</br>
                    		11111111111111111111111111111</br>
                    		11111111111111111111111111111</br>
                    		11111111111111111111111111111</br>
                    		11111111111111111111111111111</br>
                    		11111111111111111111111111111</br>
                    		11111111111111111111111111111</br>
                    		11111111111111111111111111111</br>
                    		11111111111111111111111111111</br>
                    		11111111111111111111111111111</br>
                    		11111111111111111111111111111</br>
                    </div>
				</div>
            </div>
            
            <div class="col-sm-4" data-id="96764297878704285" data-color="dashboard-color-blue" data-order="8">
            	<div class="panel dashboard-color-blue" id="widget-1" data-url="" data-id="1">
	                <div class="panel-heading">
                        <div class="panel-actions">
                            <a class="action fullscreen-panel" type="button">
                                <i class="home_fullscreen">放大</i>
                            </a>
                            <a class="action collapse-panel" type="button">
                                <i class="home_collapse">折叠</i>
                            </a>
                            <a class="action remove-panel" type="button">
                                <i class="home_remove">关闭</i>
                            </a>
                        </div>
                        <i class="home_calendar"></i><span class="panel-title">我的任务</span>
                    </div>
                    <div class="panel-body">
                    		11111111111111111111111111111</br>
                    		11111111111111111111111111111</br>
                    		11111111111111111111111111111</br>
                    		11111111111111111111111111111</br>
                    		11111111111111111111111111111</br>
                    		11111111111111111111111111111</br>
                    		11111111111111111111111111111</br>
                    		11111111111111111111111111111</br>
                    		11111111111111111111111111111</br>
                    		11111111111111111111111111111</br>
                    		11111111111111111111111111111</br>
                    </div>
				</div>
            </div>
            
        </div>
    </div>
    
    <div class="row form-group-margin">
        <div class="col-xs-12">
            <button type="button" class="btn col-xs-12" id="widgetSelect">设置部件</button>
        </div>
    </div>
    
    
    
</div>
    <script type="text/javascript">
    	$(function(){
    		$('#dashboard').dashboard({
    			//height: 360,
		        shadowType: 'normal',
		        sensitive: false,
		        circleShadowSize: 100,
		        onFullScreen: function() {alert('放大回掉函数')},
		        onCollapse: function() {alert('折叠回掉函数')},
		        onColor: function() {},
		        onRemove: function() {alert('关闭回掉')}
    		});
    	})
    	
    	
    	$('#widgetSelect').on('click', function(){
			layer.open({
			    type: 2,
			    //skin: 'layui-layer-lan',
			    title: 'layer弹层组件',
			    fix: true,
			    shadeClose: true,
			    maxmin: true,
			    area: ['1000px', '500px'],
			    content:'tankuang.html', //'http://layer.layui.com/?form=local',
			    end: function(){
			      //layer.tips('试试相册模块？', '#photosDemo', {tips: 1})
			    }
			});
		});







    	
    	
    	
    	
    	
    	
    	
    </script>
</body>
</html>